<template>
  <div class="Weixin">
    <van-nav-bar
      title="绑定微信账号"
      left-text=""
      left-arrow
      @click-left="onClickLeft"
    />
    <div class="picture">
      <img src="images\weixin.png" alt="" />
    </div>
    <van-tabs @click="onClick">
      <van-tab title="验证码登录">
        <van-field
          v-model="sms"
          center
          clearable
          label="短信验证码"
          placeholder="请输入短信验证码"
        >
          <template #button>
            <van-button size="small" type="info">发送验证码</van-button>
          </template>
        </van-field>
      </van-tab>
      <div class="center">
        <van-button type="info" size="small">确认绑定</van-button>
        <van-button type="info" size="small">取消绑定</van-button>
      </div>
    </van-tabs>
  </div>
</template>

<script>
export default {
  name: "Weixin",
  methods: {
    onClickLeft() {
      this.$router.push("/SanFangConnect");
    },
  },
};
</script>

<style scope lang="less">
.picture {
  width: 100px;
  height: 100px;
  img {
    width: 100%;
    height: 100%;
  }
}
.center {
  margin: 0 auto;
  display: flex;
  padding: 5%;
  width: 40%;
  justify-content: space-between;
}
</style>